import { LeftOutlined, RightOutlined } from '@ant-design/icons';

export const SlickArrowLeft = ({ currentSlide, slideCount, ...props }) => (
  <button
    {...props}
    className={`ant-btn ant-btn-primary ant-btn-circle ant-btn-sm ant-btn-icon-only slick-arrow slick-prev ${
      currentSlide === 0 ? ' slick-disabled' : ''
    }`}
    aria-hidden="true"
    aria-disabled={currentSlide === 0}
    type="button"
  >
    <LeftOutlined />
  </button>
);
export const SlickArrowRight = ({ currentSlide, slideCount, ...props }) => (
  <button
    {...props}
    className={`ant-btn ant-btn-primary ant-btn-circle ant-btn-sm ant-btn-icon-only slick-arrow slick-next ${
      currentSlide === slideCount - 1 ? ' slick-disabled' : ''
    }`}
    aria-disabled={currentSlide === slideCount - 1}
    type="button"
  >
    <RightOutlined />
  </button>
);
